<!-- #donation -->
<article id="donation">
    <footer class="online-giving has-arrow">
        <div class="container">
            <div class="row">
                <div class="parallax-area" data-1100="top:-50px" data-1500="top:0" data-2600="top:0" data-3000="top:0"></div>
                <div class="col-sm-8">
                    <h1>Online Donation</h1>
                    <p style="margin-bottom: 70px;">
                        Pertolongan sejati hanya dari Tuhan. Tuhanlah yang menggerakkan tangan orang-orang itu untuk membantu sesama.
                    </p>
                    <a href="#" id="read_donation_term">
                        <span class="btn-collapse" style="margin-right: 10px;">&nbsp;</span>
                        <strong>BACA PENJELASAN DONASI</strong>
                    </a>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <div class="well" id="donation_term" style="margin-top: 30px; display: none;">
                        <?php 
                            $donation_term = get_option('donation_term');
                            if(!empty($donation_term)) echo $donation_term;
                        ?>                           
                    </div>
                    <?php if( !ippi_isset($member_logged) ): ?>
                        <p class="margin-top-35 margin-bottom-0">
                            <a href="#" class="btn btn-default" id="btn-donation">Make donation</a>
                        </p>
                    <?php endif ?>
                </div>
            </div>
            
            <?php if( ippi_isset($member_logged) ): ?>
                <div class="row" style="margin-top: 30px;">
                    <div class="col-sm-12">
                        
                        <!-- .tabs-wrapper -->
                        <div class="tabs-wrapper">
                            <ul class="nav nav-tabs">
                                <li class="active"><a href="#make-donation" data-toggle="tab" id="tab-md1">Make Donation</a></li>
                                <li><a href="#list-donation" data-toggle="tab" id="tab-md2">List Donation</a></li>
                            </ul>
                        </div>
                        <!-- /.tabs-wrapper -->
                        
                        <!-- #message -->
                        <div id="messages_donation" style="display: none; margin: 15px 0 0 0;" class="messages alert-danger registration"></div>
                        <!-- /#message -->
                        
                        <!-- .tab-content -->
                        <ul id="tab-content-donation" class="tab-content fixed-max-width">
                            <!-- Make Donation -->
                            <li class="panel">
                                <a data-toggle="collapse" data-parent="#tab-content-donation" href="#make-donation" id="tab-panel-md1">Make Donation</a>
                                <div id="make-donation" class="tab-pane panel-collapse collapse in">
                                    <div class="panel-body">
                                    
                                        <!-- Make Donation Form -->
                                        <div id="md1">
                                            <form role="form" method="post" id="make-donation-form" class="contact-form" action="">
                                                <h3>Pilih Donasi</h3>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_kat" name="donasi_kat">
                                                        <option value="">Pilih Kategori Donasi</option>
                                                        <option value="female">Female Fund</option>
                                                        <option value="baby">Baby Fund</option>
                                                        <option value="children">Children Fund</option>
                                                    </select>
                                                    <div id="donasi_kat_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_jum" name="donasi_jum">
                                                        <option value="">Pilih Jumlah Donasi (Rp)</option>
                                                        <?php if(!empty($donation_value)): ?>
                                                            <?php foreach($donation_value as $opt): ?>
                                                                <option value="<?php echo $opt; ?>"><?php echo number_format($opt, 0, '', '.'); ?></option>
                                                            <?php endforeach ?>
                                                        <?php endif ?>
                                                    </select>
                                                    <div id="donasi_jum_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <textarea class="form-control" id="donasi_ket" name="donasi_ket" placeholder="Keterangan Donasi (Optional)" rows="7"></textarea>
                                                </div>
                                                <div class="form-group input-group">
                                                    <div class="row">
                                                        <div class="col-sm-6"></div>
                                                        <div class="col-sm-6 text-right">
                                                            <a href="#" id="button-donasi-send" class="btn btn-default">Submit</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                        <!-- /Make Donation Form -->
                                        
                                        <!-- Confirm Donation Form -->
                                        <div id="md2" style="display: none;">
                                            <form role="form" method="post" id="confirm-donation-form" class="contact-form" action="">
                                                <input type="hidden" id="don_id" name="don_id" value="" />
                                                <h3>Konfirmasi Donasi</h3>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_conf_kat" name="donasi_conf_kat">
                                                        <option value="">Pilih Kategori Donasi</option>
                                                        <option value="female">Female Fund</option>
                                                        <option value="baby">Baby Fund</option>
                                                        <option value="children">Children Fund</option>
                                                    </select>
                                                    <div id="donasi_conf_kat_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_conf_jum" name="donasi_conf_jum">
                                                        <option value="">Pilih Jumlah Donasi (Rp)</option>
                                                        <?php if(!empty($donation_value)): ?>
                                                            <?php foreach($donation_value as $opt): ?>
                                                                <option value="<?php echo $opt; ?>"><?php echo number_format($opt, 0, '', '.'); ?></option>
                                                            <?php endforeach ?>
                                                        <?php endif ?>
                                                    </select>
                                                    <div id="donasi_conf_jum_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <input type="text" class="form-control" id="donasi_conf_tgl" name="donasi_conf_tgl" placeholder="Tanggal Donasi" />
                                                    <div id="donasi_conf_tgl_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_conf_cara" name="donasi_conf_cara">
                                                        <option value="">Pilih Cara Donasi</option>
                                                        <?php if(!empty($donation_mode)): ?>
                                                            <?php foreach($donation_mode as $key => $opt): ?>
                                                                <option value="<?php echo $key; ?>"><?php echo $opt; ?></option>
                                                            <?php endforeach ?>
                                                        <?php endif ?>
                                                    </select>
                                                    <div id="donasi_conf_cara_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <input type="text" class="form-control" id="donasi_conf_bankasal" name="donasi_conf_bankasal" placeholder="Bank Asal" />
                                                    <div id="donasi_conf_bankasal_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <input type="text" class="form-control" id="donasi_conf_rekasal" name="donasi_conf_rekasal" placeholder="No Rekening Asal" />
                                                    <div id="donasi_conf_rekasal_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="donasi_conf_brtuj" name="donasi_conf_brtuj">
                                                        <option value="">Pilih Bank dan Rekening Tujuan</option>
                                                        <?php if(!empty($donation_bank)): ?>
                                                            <?php foreach($donation_bank as $key => $opt): ?>
                                                                <option value="<?php echo $key; ?>"><?php echo $opt['name'] .' ('.$opt['rek'].')'; ?></option>
                                                            <?php endforeach ?>
                                                        <?php endif ?>
                                                    </select>
                                                    <div id="donasi_conf_brtuj_info" class="info"></div>
                                                </div>
                                                <div class="form-group input-group">
                                                    <textarea class="form-control" id="donasi_conf_ket" name="donasi_conf_ket" placeholder="Alamat untuk pengiriman souvenir" rows="7"></textarea>
                                                </div>
                                                <div class="form-group input-group">
                                                    <div class="row">
                                                        <div class="col-sm-6"></div>
                                                        <div class="col-sm-6 text-right">
                                                            <a href="#" id="button-donasi-conf-cancel" class="btn btn-default">Cancel</a>
                                                            <a href="#" id="button-donasi-conf-send" class="btn btn-default">Submit</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                        <!-- /Confirm Donation Form -->
                                    
                                    </div>
                                </div>
                            </li>
                            <!-- /Make Donation -->
                            
                            <!-- List Donation -->
                            <li class="panel">
                                <a data-toggle="collapse" data-parent="#tab-content-donation" href="#list-donation" id="tab-panel-md2">List Donation</a>
                                <div id="list-donation" class="tab-pane panel-collapse collapse">
                                    <div class="panel-body">
                                        <div class="row">
                                            <div class="col-sm-3">
                                                <div class="form-group input-group">
                                                    <input type="text" class="form-control" id="don_tanggal" name="don_tanggal" placeholder="Tanggal" />
                                                </div>
                                            </div>
                                            <div class="col-sm-3">
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="don_status" name="don_status">
                                                        <option value="">Pilih Status</option>
                                                        <option value="0">Pending</option>
                                                        <option value="2">Review</option>
                                                        <option value="1">Confirmed</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-sm-3">
                                                <div class="form-group input-group">
                                                    <select class="form-control" id="don_kat" name="don_kat">
                                                        <option value="">Pilih Kategori</option>
                                                        <option value="female">Female Fund</option>
                                                        <option value="baby">Baby Fund</option>
                                                        <option value="children">Children Fund</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-sm-3">
                                                <div class="form-group input-group">
                                                    <input type="text" value="" id="search_donation" name="search_donation" placeholder="Cari nominal..." class="form-control" onkeypress="return isNumber(event)" />
                                                    <button class="btn btn-primary input-addon" id="btn_search_donation" style="padding: 3px 12px !important;">
                                						<i class="glyphicon icon-search"></i>
                                					</button>
                                                </div>
                                            </div>
                                        </div>
                                    
                                        <!-- Donation List -->                              
                                        <ul class="list-donation" id="list-don"></ul>
                                        <!-- Pagination -->
                                        <div id="pagination_donation"></div>
                                    </div>
                                </div>
                            </li>
                            <!-- /List Donation -->
                        </ul>
                        <!-- /.tab-content -->
                        
                    </div>
                </div>
            <?php endif ?>
        </div>
    </footer>
</article>
<!-- /#donation -->